import React, { memo, useState } from "react";
import { GoodsDetailSummaryWrapper } from "./style";
import { Tabs } from "antd";

const { TabPane } = Tabs;
export default memo(function GoodsSummary(props) {
  const { detail } = props;
  const baseInfo = detail.basicInfo;
  function callback(key) {
    console.log(key);
  }
  return (
    <GoodsDetailSummaryWrapper>
      {detail ? (
        <Tabs type="card" defaultActiveKey="1" onChange={callback}>
          <TabPane tab="商品介绍" key="1">
            <div
              dangerouslySetInnerHTML={{ __html: detail.content }}
              className="jiesao-content"
            ></div>
          </TabPane>
          <TabPane tab="规格与包装" key="2">
            规格与包装
          </TabPane>
          <TabPane tab="售后保障" key="3">
            <diiv className="after-scle">
              一片月平台卖家销售并发货的商品，由平台卖家提供发票和相应的售后服务。请您放心购买！
              注：因厂家会在没有任何提前通知的情况下更改产品包装、产地或者一些附件，本司不能确保客户收到的货物与商城图片、产地、附件说明完全一致。只能确保为原厂正货！并且保证与当时市场上同样主流新品一致。若本商城没有及时更新，请大家谅解！
            </diiv>
          </TabPane>
          <TabPane tab="商品评价" key="4">
            商品评价
          </TabPane>
          <TabPane tab="其他" key="5">
            其他
          </TabPane>
        </Tabs>
      ) : (
        <div></div>
      )}
    </GoodsDetailSummaryWrapper>
  );
});
